<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org"
      xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity3"
      xmlns:shiro="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .nav > li > a {
            font-weight: 600 !important;
        }
    </style>
</head>
<body>
<aside th:fragment="head">
    <div class="pre-header">
        <div class="container">
            <div class="row">
                <!-- BEGIN TOP BAR LEFT PART -->
                <div class="col-md-6 col-sm-6 additional-shop-info">
                    <ul class="list-unstyled list-inline">
                        <li><i class="fa fa-phone"></i><span>+1 456 6717</span></li>
                        <!-- BEGIN CURRENCIES -->
                        <!--   显示货币
                        <li class="shop-currencies">
                            <a href="javascript:void(0);">€</a>
                            <a href="javascript:void(0);">£</a>
                            <a href="javascript:void(0);" class="current">$</a>
                        </li>
                        -->
                        <!-- END CURRENCIES -->
                        <!-- BEGIN LANGS -->
                        <li class="langs-block">
                            <a onclick="change('zh_cn')" class="current" th:text="#{language.zh}"><i
                                    class="fa fa-angle-down"></i></a>
                            <div class="langs-block-others-wrapper">
                                <div class="langs-block-others">
                                    <a onclick="change('en_us')" th:text="#{language.en}"></a>
                                </div>
                            </div>
                        </li>
                        <!-- END LANGS -->
                    </ul>
                </div>
                <!-- END TOP BAR LEFT PART -->
                <!-- BEGIN TOP BAR MENU -->
                <div class="col-md-6 col-sm-6 additional-nav">
                    <ul class="list-unstyled list-inline pull-right">
                        <li><a href="/touristShop/shoppingUser" th:text="#{login.account}"></a></li>
                        <li><a id="myOrder_1" href="/order/myOrder">我的订单</a></li>
                        <li><a href="/shopDetail/myCollect" th:text="#{login.my}"></a></li>
                        <li><a id="loginOut_1" href="javascript:void(0);" th:text="#{login.checkOut}"></a></li>
                        <li><a id="login_1" href="javascript:void(0);" th:text="#{login.login}"></a></li>
                    </ul>
                </div>
                <!-- END TOP BAR MENU -->
            </div>
        </div>
    </div>
    <!-- END TOP BAR -->
</aside>
<aside th:fragment="head-navigation">
    <!-- BEGIN HEADER -->
    <div role="navigation" class="navbar header no-margin">
        <div class="container">
            <div class="navbar-header">
                <!-- BEGIN RESPONSIVE MENU TOGGLER -->
                <button data-target=".navbar-collapse" data-toggle="collapse" class="navbar-toggle" type="button">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <!-- END RESPONSIVE MENU TOGGLER -->
                <a href="/touristShop/index" class="navbar-brand"><img src="../bootstrap/user/img/youhe.png"
                                                                       height="40px" width="160px"
                                                                       alt="Metronic Shop UI"></a><!-- LOGO -->
            </div>
            <!-- BEGIN CART -->
            <div class="cart-block">
                <div class="cart-info">
                    <a href="javascript:void(0);" class="cart-info-count">{{carData.items}} 项</a>
                    <a href="javascript:void(0);" class="cart-info-value">¥{{carData.prices}}</a>
                </div>
                <i class="fa fa-shopping-cart"></i>
                <!-- BEGIN CART CONTENT -->
                <div class="cart-content-wrapper">
                    <div class="cart-content">
                        <ul class="scroller" style="height: 250px;">
                            <li v-for="item in shopList">
                                <a href="item.html"><img :src="item.pageaddr+item.saveFileName"
                                                         alt="Rolex Classic Watch"
                                                         width="37" height="34"></a>
                                <span class="cart-content-count">x {{item.cartNum}}</span>
                                <strong>
                                    <a href="item.html">{{item.name}}</a>
                                </strong>
                                <em>¥{{item.pirce}}</em>
                                <a href="javascript:void(0);" @click="delCart($event,item)" :name="item.id"
                                   class="del-goods"><i class="fa fa-times"></i></a>
                            </li>
                        </ul>
                        <div class="text-right">
                            <a href="/order/shoppingPurchase" class="btn btn-default">购物车详情</a>
                            <a href="/order/shoppingPurchase" class="btn btn-primary">结算</a>
                        </div>
                    </div>
                </div>
                <!-- END CART CONTENT -->
            </div>
            <!-- END CART -->
            <!-- BEGIN NAVIGATION -->
            <div class="collapse navbar-collapse mega-menu">
                <ul class="nav navbar-nav">
                    <li class="dropdown">
                        <a class="dropdown-toggle" data-toggle="dropdown" data-delay="0" data-close-others="false"
                           data-target="product-list.html" href="product-list.html" style="  font-weight: 600;">
                            商品
                            <i class="fa fa-angle-down"></i>
                        </a>
                        <ul class="dropdown-menu" aria-labelledby="mega-menu">
                            <li>
                                <div class="nav-content">
                                    <tree-head :lists="lists">
                                    </tree-head>
                                </div>
                            </li>
                        </ul>
                    </li>
                    <li class="dropdown">
                        <a class="dropdown-toggle" data-toggle="dropdown" data-delay="0" data-close-others="false"
                           data-target="product-list.html" href="product-list.html" style="font-weight: 600;">
                            新品推荐
                            <i class="fa fa-angle-down"></i>
                        </a>
                        <!-- BEGIN DROPDOWN MENU -->
                        <ul class="dropdown-menu" aria-labelledby="mega-menu-catalogue">
                            <li>
                                <div class="nav-content">
                                    <div class="product-item">
                                        <div class="pi-img-wrapper">
                                            <a href="item.html"><img
                                                    src="http://localhost/templates/upload/台灯_小轮播.jpg"
                                                    class="img-responsive" alt="Berry Lace Dress"></a>
                                        </div>
                                        <h3><a href="item.html">Berry Lace Dress</a></h3>
                                        <div class="pi-price">$29.00</div>
                                        <a href="#" class="btn btn-default add2cart">加入购物车</a>
                                    </div>
                                    <div class="product-item">
                                        <div class="pi-img-wrapper">
                                            <a href="item.html"><img
                                                    src="http://localhost/templates/upload/台灯_小轮播.jpg"
                                                    class="img-responsive" alt="Berry Lace Dress"></a>
                                        </div>
                                        <h3><a href="item.html">Berry Lace Dress</a></h3>
                                        <div class="pi-price">$29.00</div>
                                        <a href="#" class="btn btn-default add2cart">加入购物车</a>
                                    </div>
                                    <div class="product-item">
                                        <div class="pi-img-wrapper">
                                            <a href="item.html"><img
                                                    src="http://localhost/templates/upload/台灯_小轮播.jpg"
                                                    class="img-responsive" alt="Berry Lace Dress"></a>
                                        </div>
                                        <h3><a href="item.html">Berry Lace Dress</a></h3>
                                        <div class="pi-price">$29.00</div>
                                        <a href="#" class="btn btn-default add2cart">加入购物车</a>
                                    </div>
                                </div>
                            </li>
                        </ul>
                        <!-- END DROPDOWN MENU -->
                    </li>
                    <li class="menu-search">
                        <span class="sep"></span>
                        <i class="fa fa-search search-btn"></i>
                        <div class="search-box">
                            <form action="#">
                                <div class="input-group">
                                    <input type="text" placeholder="输入关键字" class="form-control" v-model="searcnName">
                                    <span class="input-group-btn">
                                        <a class="btn btn-primary" @click="searchShop($event)"
                                           style="color: aliceblue; background: #e94d1c;border-color: #e94d1c;">搜索</a>
                                    </span>
                                </div>
                            </form>
                        </div>
                    </li>
                </ul>
            </div>
            <!-- END NAVIGATION -->
        </div>
    </div>
    <!-- END HEADER -->
</aside>
</body>
</html>